/* 添加到 battle.css 文件末尾 */
/* 攻击动画 */
@keyframes attack {
    0% {
        transform: translate(0, 0);
    }

    50% {
        transform: translate(0, -30px) scale(1.2);
    }

    100% {
        transform: translate(0, 0);
    }
}

.field-character.attacking {
    animation: attack 0.4s ease-in-out 1;
}

/* 新的打牌动画 */
@keyframes playCard {
    0% {
        transform: translateY(0) rotate(0deg);
        opacity: 1;
    }
    50% {
        transform: translateY(-100px) rotate(15deg) scale(1.2);
    }
    100% {
        transform: translateY(-200px) rotate(30deg) scale(0.8);
        opacity: 0;
    }
}

.card.playing {
    animation: playCard 0.3s forwards;
    pointer-events: none;
}

/* 新的抽牌动画 */
@keyframes drawCard {
    0% {
        transform: translate(-50%, 100px) rotate(180deg);
        opacity: 0;
    }
    50% {
        transform: translate(-50%, -20px) rotate(90deg) scale(1.1);
    }
    100% {
        transform: translate(-50%, 0) rotate(0deg);
        opacity: 1;
    }
}

.card.drawing {
    animation: drawCard 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* 技能特效动画 */
@keyframes skillEffect {
    0% {
        transform: scale(0);
        opacity: 1;
    }

    50% {
        transform: scale(1.5);
        opacity: 0.8;
    }

    100% {
        transform: scale(2);
        opacity: 0;
    }
}

.skill-effect::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background: radial-gradient(circle, #ffd700 20%, transparent 70%);
    animation: skillEffect 0.6s ease-out 1 forwards;
    pointer-events: none;
}

/* 法力消耗光效增强 */
@keyframes manaGlow {
    0% { box-shadow: 0 0 5px var(--mana-color, #ffd700); }
    50% { box-shadow: 0 0 20px var(--mana-color, #ffd700); }
    100% { box-shadow: 0 0 5px var(--mana-color, #ffd700); }
}

.card:not(.playing):hover .card-cost {
    animation: manaGlow 1s infinite;
}

/* 生命值变化动画 */
@keyframes hpChange {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.3);
        color: #ff4444;
    }

    100% {
        transform: scale(1);
    }
}

.char-hp.changing {
    animation: hpChange 0.6s ease;
}

/* 新的入场动画 */
@keyframes enterBattlefield {
    0% {
        transform: scale(0.5) rotateX(90deg);
        opacity: 0;
    }
    60% {
        transform: scale(1.1) rotateX(-15deg);
        opacity: 1;
    }
    100% {
        transform: scale(1) rotateX(0deg);
    }
}

.field-character.entering {
    animation: enterBattlefield 0.6s ease-out;
}